<template>
    <el-form :model="tBridgeForm" status-icon :rules="rules" ref="tBridgeForm"
             label-width="150px"
             style="margin-top: 10px;color: #1f2d3d">
        <el-form-item class="form-label" label="编码" prop="bid">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.bid" placeholder="编码"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥梁名称" prop="name">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.name" placeholder="桥梁名称"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="经度" prop="longitude">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.longitude" placeholder="经度"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="纬度" prop="latitude">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.latitude" placeholder="纬度"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="跨越障碍" prop="acrossObject">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.acrossObject" placeholder="跨越障碍"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="设防烈度" prop="intensity">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.intensity" placeholder="设防烈度"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="建设年代" prop="year">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.year" placeholder="建设年代"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥梁结构类型" prop="structureType">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.structureType" placeholder="桥梁结构类型"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="最大跨径" prop="maxSpan">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.maxSpan" placeholder="最大跨径"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="跨径总长" prop="lengthTotal">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.lengthTotal" placeholder="跨径总长"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="场地分类" prop="widthSoil">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.widthSoil" placeholder="场地分类"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥梁等级" prop="level">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.level" placeholder="桥梁等级"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="地基失效程度" prop="foundationFail">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.foundationFail" placeholder="地基失效程度"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="上部结构" prop="upperStructure">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.upperStructure" placeholder="上部结构"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="支座形式" prop="bearing">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.bearing" placeholder="支座形式"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥墩高度" prop="pierHeight">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.pierHeight" placeholder="桥墩高度(m)"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥墩材料" prop="pierMaterial">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.pierMaterial" placeholder="桥墩材料"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="基础形式" prop="basement">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.basement" placeholder="基础形式"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="最大载重量" prop="maxCapacity">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.maxCapacity" placeholder="最大载重量"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥台材料" prop="abutmentMat">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.abutmentMat" placeholder="桥台材料"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥台类型" prop="abutmentType">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.abutmentType" placeholder="桥台类型"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="伸缩缝数量" prop="expansionJoint">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.expansionJoint" placeholder="伸缩缝数量"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="桥梁宽度" prop="width">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.width" placeholder="桥梁宽度"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="简介" prop="note">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.note" placeholder="简介"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="备注" prop="remark">
            <el-col :span="19">
                <el-input v-model="tBridgeForm.remark" placeholder="备注"
                          maxlength="20" autocomplete="off"></el-input>
            </el-col>
        </el-form-item>
        <el-form-item class="form-label" label="关联子任务" prop="sid" style="display: none">
            <el-input v-model="tBridgeForm.sid"
                      maxlength="20" autocomplete="off"/>
        </el-form-item>
    </el-form>
</template>

<script>
    import qs from 'qs';

    export default {
        name: "NewTrafficBridge",
        data() {
            return {
                tBridgeForm: {
                    id: '',
                    bid: '',
                    name: '',
                    longitude: '',
                    latitude: '',
                    acrossObject: '',
                    intensity: '',
                    year: '',
                    structureType: '',
                    maxSpan: '',
                    lengthTotal: '',
                    widthSoil: '',
                    level: '',
                    foundationFail: '',
                    upperStructure: '',
                    bearing: '',
                    pierHeight: '',
                    pierMaterial: '',
                    basement: '',
                    maxCapacity: '',
                    abutmentMat: '',
                    abutmentType: '',
                    expansionJoint: '',
                    width: '',
                    note: '',
                    remark: '',
                    sid: ''
                },
                rules: {
                    bid: [],
                    name: [],
                    longitude: [],
                    latitude: [],
                    acrossObject: [],
                    intensity: [],
                    year: [],
                    structureType: [],
                    maxSpan: [],
                    lengthTotal: [],
                    widthSoil: [],
                    level: [],
                    foundationFail: [],
                    upperStructure: [],
                    bearing: '',
                    pierHeight: '',
                    pierMaterial: '',
                    basement: '',
                    maxCapacity: '',
                    abutmentMat: '',
                    abutmentType: '',
                    expansionJoint: '',
                    width: '',
                    note: [],
                    remark: []
                }
            }
        },
        mounted() {
            if (this.id !== -1) {
                axios.post("/bjdzms/trafficBridgeData/findById",
                    qs.stringify({
                        'id': this.id
                    })).then(res => {
                    this.tBridgeForm = res.data.datas;
                });
            }
        },
        props: {
            sid: {
                type: Number,
                default: -1
            },
            id: {
                type: Number,
                default: -1
            }
        },
        methods: {
            to(path) {
                this.$router.push({name: path});
            },
            submitForm() {
                if (this.id !== -1) {
                    this.tBridgeForm.id = this.id;
                    axios.post("/bjdzms/trafficBridgeData/upd",
                        qs.stringify(this.tBridgeForm)
                    ).then(res => {
                        this.$emit('updateData');
                    });
                } else {
                    this.tBridgeForm.sid = this.sid;
                    axios.post("/bjdzms/trafficBridgeData/add",
                        qs.stringify(this.tBridgeForm)
                    ).then(res => {
                        this.$emit('updateData');
                    });
                }
            }
        }
    }
</script>

<style>
    .el-upload-dragger {
        height: 40px !important;
    }
</style>

<style scoped>
    .el-header {
        background: #EBEBEB;
        color: #e5e9ef;
        font-size: 2em;
        line-height: 80px;
        border: 5px solid #EBEBEB;
    }

    .el-main {
        background: #fff;
    }

    .el-container {
        height: 100%;
    }

    .el-form-item {
        width: 610px;
    }
</style>
